
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>
<html>
<head>
    <title>问卷调查</title>
    <link rel="stylesheet" href="${frames}/css/lib/bootstrap.min.css" type="text/css" type="text/css">
    <script src="${js}/jquery-1.9.1.min.js"></script>
    <script src="../assets/js/views/vue.min.js"></script>
    <%--<link rel="stylesheet" href="../assets/css/views/modules/_common.scss">--%>
    <%--<link rel="stylesheet" href="${assets}/css/views/department/departmentMgr.css">--%>
    <link rel="stylesheet" href="../assets/css/views/question/question.css">
    <link rel="stylesheet" href="${frames}/css/lib/dataTables.bootstrap.css" type="text/css">
    <%@ include file="/WEB-INF/jsp/component/commonBottom.jsp"%>
    <link rel="stylesheet" href="${assets}/css/views/department/departmentMgr.css">
    <style>
        #tablepart #example tbody tr{
            border-bottom:1px solid #e6e6e6;
        }
        table.dataTable td:nth-child(5) a{
            color:black;
        }
        #example input{
            width:18px;
            height:18px;
            vertical-align: middle;
            margin:0 auto;
            border: solid 1px #999999;
        }
        table.dataTable thead > tr > th{
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            line-height: 30px;
            letter-spacing: 0px;
            color: #999999;
            text-align:center;
        }
        table.dataTable td{
            font-family: MicrosoftYaHei;
            font-size: 16px;
            font-weight: normal;
            font-stretch: normal;
            letter-spacing: 0px;
            color: #333333;
            text-align:center;
            padding:13px 0;
        }
        #example_paginate{
            text-align:center;
        }
        .pagewidth{
            width:100%;
            margin-top:26px;
        }
        h1{
            margin:0 !important;
            padding:0 !important;
            line-height:60px;
        }
        .add{
            margin:0 !important;
        }
        .dataTables_empty{
            line-height:30px;
        }
    </style>
</head>
<body>
<div>
    <%@ include file="../../breadline.jsp" %>
</div>
<div class="wrap">
    <div class="content" id="main">
        <div class="contianer">
            <h1>问卷管理</h1>
            <div class="add">
                <span>新增问卷</span>
                <select name="questionType" id="questionType" style="font-size:15px;">
                    <option>请选择问卷类型</option>
                    <option v-for="item in questionType" :title="item.id">{{item.title}}</option>
                </select>
                <button id="add" class="btn" @click="add()">新增</button>
            </div>
            <div id="tablepart" style="width:100%;overflow:hidden">
                <table id="example" class="display" cellspacing="10" width="100%">
                    <thead>
                    <tr>
                        <th>问卷类型</th>
                        <th>填写医生</th>
                        <th>病人姓名</th>
                        <th>填写时间</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>
<script>
    var vm = new Vue({
        el:'#main',
        data:{
            type:'',
            id:'',
            url:'',
            questionType:[],
            typeId:'',
            idcard:'',
            patientId:''
        },
        mounted(){
            let that = this;
            var href = window.location.search;
            that.id = href.split('?')[1].split('&')[0].split('=')[1]
            that.type = href.split('?')[1].split('&')[1].split('=')[1]
            that.patientId = href.split('?')[1].split('&')[2].split('=')[1]
            var table;
            that.url = '${URL_QUESTIONNAIRE_RECORDS}?idCard='+ that.id+'&type='+that.type
            $.ajax({
                url :'${URL_QUESTIONNAIRE_TITLES}',
                data:{
                    type:that.type
                },
                dataType:'json',
                type:'post',
                success:function(data){
                    that.questionType = data.data
                }
            })
            that.initTable()
        },
        methods:{
            initTable:function() {
                let that = this
                var table = $('#example').DataTable({
                    "dom": "<'row'<'col-xs-2'l><'#mytool.col-xs-10'><'col-xs-6'f>r>" +
                    "t" +
                    "<'row'<'col-xs-6'i><'col-xs-6'p>>",
                    "bFilter": false,//去掉搜索框
                    "bAutoWidth": true, //自适应宽度
                    "info": false,
                    "bSort": false,
                    "ordering": false,
                    "sPaginationType" : "full_numbers",
                    "ordering": false,//是否允许Datatables开启排序
                    "bProcessing" : true,
                    "bServerSide" : true,
                    "searching" : false, //去掉搜索框方法一
                    "bFilter": false,
                    'lengthChange' : false,
                    "oPaginate":false,
                    "sAjaxSource":that.url,
                    "sAjaxDataProp": "dataList",//查询后，返回的集合
                    "fnServerData": function ( sSource, aoData, fnCallback ) {  //查询条件
                        aoData.push(),
                        $.ajax( {
                            "dataType": 'json',
                            "url": sSource,
                            "type":'post',
                            'data':aoData,
                            "success": function(resp){
                                console.log(resp.data)
                                fnCallback(resp.data)
                            }
                        });
                    },
                    "aoColumns" : [{
                        "targets": 0,
                        "data": null,
                        "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                            $(nTd).html('' +
                                '&nbsp;&nbsp;<a href="##" onClick="Go(this)" style="color:black;border-bottom:#35acfd dashed 1px">'+oData.title+'<span ' +
                                'style="display:none">'+oData.id+'</span>'+'<i style="display:none">'+oData.titleId+'</i>'+'</a>' +
                                '');
                        }
                    },{
                        "mDataProp" : "doctorName"
                    },{
                        "mDataProp" : "patientName"
                    },{
                        "targets": 3,
                        "data": null,
                        "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                            $(nTd).text(oData.createTime.slice(0,10))
                        }
                    }],
                    "oLanguage": {//插件的汉化
                        "sLengthMenu": "32",
                        "sZeroRecords" : "抱歉， 没有找到",
                        "sInfoEmpty" : "没有数据",
                        "sInfoFiltered" : "(从 _MAX_ 条数据中检索)",
                        "oPaginate" : {
                            "sFirst" : "",
                            "sPrevious" : "<b>上一页<b>",
                            "sLast" : "",
                            "sNext" : "<i>下一页</i>"
                        },
                        "sZeroRecords" : "没有检索到数据",
                        "sProcessing" : "<img src='' />",
                        "sSearch" : "搜索"
                    }
                } );
                $('#example_paginate').parent().addClass('pagewidth');
            },
            add:function(){
                let that = this;
                if( $('#questionType option:selected').text() === '请选择问卷类型' ){
                    alert('请选择能的类型')
                }else{
                    that.typeId = $('#questionType option:selected').attr('title')
                    $.ajax({
                        url:"${URL_SCREENING_GETBREADLINE}",
                        dataType:'json',
                        type:'post',
                        success:function(data){
                            breadLine = JSON.parse(data.data)
                            var url = '${URL_QUESTIONNAIRE_TOADD}?id='+that.typeId+'&idCard='+that.id + '&patientId='+that.patientId+'&type='+that.type
                            console.log(url)
                            breadLine.push({
                                name:'问卷调查',
                                href:url
                            })
                            $.ajax({
                                url:'${URL_SCREENING_SAVEBREADLINE}',
                                data:{
                                    breadLine:JSON.stringify(breadLine)
                                },
                                dataType:'json',
                                type:'post',
                                success:function(data){
                                    parent.showSrc(url)
                                }
                            })
                        }
                    })
                }
            }
        }
    })
    function Go(obj){
        var patientId = vm.patientId
        var idcard = vm.id
        var id = obj.getElementsByTagName("span")[0].innerText.trim();
        var typeid = obj.getElementsByTagName("i")[0].innerText.trim();
        $.ajax({
            url:"${URL_SCREENING_GETBREADLINE}",
            dataType:'json',
            type:'post',
            success:function(data){
                breadLine = JSON.parse(data.data)
                var url = '${URL_QUESTIONNAIRE_TOSHOW}?typeid='+typeid+'&idcard='+idcard + '&patientId='+patientId+'&id='+id
                breadLine.push({
                    name:'问卷调查',
                    href:url
                })
                $.ajax({
                    url:'${URL_SCREENING_SAVEBREADLINE}',
                    data:{
                        breadLine:JSON.stringify(breadLine)
                    },
                    dataType:'json',
                    type:'post',
                    success:function(data){
                        parent.showSrc('${URL_QUESTIONNAIRE_TOSHOW}?typeid='+typeid+'&idcard='+idcard + '&patientId='+patientId+'&id='+id)
                    }
                })
            }
        })
    }
</script>
</body>
</html>